<template>
  <div>
    <ViewTable
      ref="viewRef"
      :formItems="formItems"
      :tableColumns="tableColumns"
      :tableHeaderBars="tableHeaderBars"
      :getTableDataService="getTableData"
    />
  </div>
</template>
<script>
import ViewTable from '../components/ViewTable';
import { FORM_ITEMS, RULE_TABLE_COLUMNS } from '../constants/coreProduct';
import { CoreRuleQueryEnum, CoreRuleExportEnum } from '../constants/enum';
import { createExcelByExport, generateUuid } from '@/utils/bizUtils';
import {
  queryCoreProductRuleService,
  exportCoreProductRuleService
} from '@/api/commodity/commodityManage/productTagManage';
export default {
  components: {
    ViewTable
  },
  data () {
    return {
      formItems: [...FORM_ITEMS],
      tableColumns: [...RULE_TABLE_COLUMNS].slice(1),
      btnLoading: {
        export: false
      }
    }
  },
  computed: {
    tableHeaderBars () {
      return [{
        label: '导出数据',
        method: this.handleExportData,
        loading: this.btnLoading.export,
        type: 'primary',
        size: 'mini'
      }]
    }
  },
  methods: {
    // 导出数据
    async handleExportData () {
      const data = {
        exportType: CoreRuleExportEnum.Original,
        ...this.$refs.viewRef.formData
      }
      const loadingFn = state => { this.btnLoading.export = state }
      const res = await exportCoreProductRuleService(data, loadingFn)
      createExcelByExport({ excelTitle: `核心商品-规则查看_${generateUuid()}`, res })
    },
    // 获取表格数据
    async getTableData (data, loadingFn) {
      const res = await queryCoreProductRuleService(
        { ...data, queryType: CoreRuleQueryEnum.View },
        loadingFn
      )
      return { retData: res?.retData?.pageData } // 表格组件接受的retData，这里需要进行转义
    }
  }
}
</script>
